<!DOCTYPE html>
<html>

<head>
<meta charset="utf-8" />
<title>登录</title>
<link rel="stylesheet" type="text/css" href="/static/css/login.css" />
	<link rel="stylesheet" href="/static/bootstrap/css/bootstrap.min.css">
	<link rel="stylesheet" href="/static/dist/css/font-awesome.min.css">
	<link rel="stylesheet" href="/static/dist/css/ionicons.min.css">
	<link rel="stylesheet" href="/static/dist/css/AdminLTE.min.css">
	<link rel="stylesheet" href="/static/dist/css/skins/all-skins.min.css">
	<link rel="stylesheet" href="/static/css/bootstrap-treeview.css">
	<link rel="stylesheet" href="/static/css/bootstrapValidator.min.css">
	<link rel="stylesheet" href="/static/plugins/datepicker/datepicker3.css">
	<link rel="stylesheet" href="/static/layer/theme/default/layer.css">

	<style>
		.inputs{
			color: #ffffff;/*输入文字、光标颜色*/
			-webkit-text-fill-color: #ffffff;/*输入文字、placeholder颜色*/
			/*caret-color: yellow;!*光标颜色*!*/
			font-size:16px;
			font-family:PingFang SC;
			font-weight:500;
			line-height:22px;
			background-color:rgba(255,255,255,0.5) ;
			color:rgba(255,255,255,1);
		}
		html{
			overflow: hidden;
		}
		.bodystyle{
			filter:alpha(opacity=94);
			-moz-opacity:0.94;
			-khtml-opacity: 0.94;
			opacity: 0.94;
			background-size:100% 100%;
			background:url(/static/img/loginbj.png) ;
		}，
	</style>
</head>

<body>
<img class="bgone" src="/static/img/loginbj.png" />
<img class="bgone2" src="/static/img/loginbj2.png" />
<div class="tablelogin2" >
	<div class="row text-center">
		<img src="/static/img/loginlogo.png">
	</div>
	<div class="row text-center">
		<div class="wel col-xs-12" style="letter-spacing: 5px">胶州城市规划电子档案信息化管理系统</div>
	</div>
	<div class="tablelogin" style="border: #BCCAEF 1px solid">
		<div class="row" style="position: relative;top:10%">
			<div class="col-xs-12 col-xs-offset-2" style="right: 0;left: 14%;bottom: 0;margin: auto;">
				<label class="fonts">用户名</label>
			</div>
			<div style="text-align: center;">
				<input type="text"  placeholder="用户名" name="username" id="username" style="margin:20px;padding-left: 15px" class="inputs"/>
			</div>
		</div>
		<div class="row" style="position: relative;top:10%">
			<div class="col-xs-12 col-xs-offset-2" style="right: 0;left: 14%;bottom: 0;margin: auto;">
				<label class="fonts">密码</label>
			</div>
			<div style="text-align: center;">
				<div class="form-horizontal">
					<div class="form-group" style="position: relative;left: 10px">
						<input type="password" placeholder="请输入密码" name="password" id="password" style="margin:20px;padding-left: 15px" class="inputs"/>
						<span id="eye" class="glyphicon glyphicon-eye-close" style="color: #ffffff;position: relative;right: 10%" @click="showPassword"></span>
					</div>
				</div>
			</div>
		</div>
		<div style="position: relative;top:7%;left: 14%">
			<input id="remember_password" type="checkbox" style="width: 20px;height: 20px"/><span class="jzmm">记住密码</span>
		</div>
		<div class="row" style="position: relative;top:20%;left: 35%">
			<input class="login" type="button" name="login" value="登录" id="login" style="color: #2584F2;font-weight: bold ;font-family: PingFang SC"/>
		</div>
	</div>
</div>
<!--<img class="pic" src="/static/img/logina.png" />-->
</body>
<script src="/static/plugins/jQuery/jquery-2.2.3.min.js"></script>
<!-- Bootstrap 3.3.6 -->
<script src="/static/bootstrap/js/bootstrap.min.js"></script>
<!-- Slimscroll -->
<script src="/static/plugins/slimScroll/jquery.slimscroll.min.js"></script>
<!-- FastClick -->
<script src="/static/plugins/fastclick/fastclick.js"></script>
<!-- AdminLTE App -->
<script src="/static/dist/js/app.js"></script>
<!-- AdminLTE for demo purposes -->
<script src="/static/dist/js/demo.js"></script>
<!--tabs-->
<script src="/static/dist/js/app_iframe.js"></script>
<script src="/static/js/bootstrap-treeview.js"></script>
<script src="/static/js/bootstrapValidator.min.js"></script>
<script src="/static/plugins/datepicker/bootstrap-datepicker.js"></script>
<script src="/static/plugins/datepicker/locales/bootstrap-datepicker.zh-CN.js"></script>
<script src="/static/js/vue.js"></script>

<script src="/static/js/vue-resource.min.js"></script>
<script src="/static/layer/layer.js"></script>
<script src="/static/js/myJs.js"></script>
<script src="/static/js/fileinput.min.js"></script>
</html>
<script>
	var count = true;
	window.document.onkeydown = isSearch;
	function isSearch(event) {
		var keynum;
		var keychar;
		var numcheck;

		if(window.event) // IE
		{
			keynum = event.keyCode
		} else if(event.which) // Netscape/Firefox/Opera
		{
			keynum = event.which
		}
		if(keynum === 13){
			var username = $("#username").val();
			var password = $("#password").val();
			if(username==''){
				cxAlert("用户名不能为空");
				return;
			}
			if(password==''){
				cxAlert("密码不能为空");
				return;
			}
			$.post("/doLogin",{"account":username,"password":password},function(data,status){
				if(data.code==200){
					window.location.href="/";
				}else{
					cxAlert(data.mess);
				}
			});
		}
	}
	$("#login").click(function(){
		var username = $("#username").val();
		var password = $("#password").val();
		if(username==''){
			cxAlert("用户名不能为空");
			return;
		}
		if(password==''){
			cxAlert("密码不能为空");
			return;
		}
		var isSave = document.getElementById('remember_password').checked;
		if(isSave){
			var username = document.getElementById('username').value;
			var password = document.getElementById('password').value;
			if (username != "" && password != "") {
				SetCookie(username, password);
			}
		}else {
			SetCookie("", "");
		}
		$.post("/doLogin",{"account":username,"password":password},function(data,status){
			if(data.code==200){
				window.location.href="/";
			}else{
				cxAlert(data.mess);
			}
		});
	});
	function SetCookie(username, password) {
		var Then = new Date();
		Then.setTime(Then.getTime() + 1866240000000);
		document.cookie = "username=" + username + "%%" + password + ";expires=" + Then.toGMTString();
	}
	window.onload = function GetCookie() {
		var nmpsd;
		var nm;
		var psd;
		var cookieString = new String(document.cookie);
		var cookieHeader = "username=";
		var beginPosition = cookieString.indexOf(cookieHeader);
		cookieString = cookieString.substring(beginPosition);
		var ends = cookieString.indexOf(";");
		if (ends != -1) {
			cookieString = cookieString.substring(0, ends);
		}
		if (beginPosition > -1) {
			nmpsd = cookieString.substring(cookieHeader.length);
			if (nmpsd != "") {
				beginPosition = nmpsd.indexOf("%%");
				nm = nmpsd.substring(0, beginPosition);
				psd = nmpsd.substring(beginPosition + 2);
				document.getElementById('username').value = nm;
				document.getElementById('password').value = psd;
				if (nm != "" && psd != "") {
					// document.forms[0].checkbox.checked = true;
					document.getElementById('remember_password').checked = true;
				}
			}
		}
	}

	$("#eye").click(function () {
		if(count){
			document.getElementById('eye').className = "glyphicon glyphicon-eye-open";
			document.getElementById('password').type = "input";
			count = !count;
		}else {
			document.getElementById('eye').className = "glyphicon glyphicon-eye-close";
			document.getElementById('password').type = "password";
			count = !count;
		}
	})
	saveInfo = function () {
		try {
			var isSave = document.getElementById('remember_password').checked;   //保存按键是否选中
			if (isSave) {
				var username = document.getElementById('username').value;
				var password = document.getElementById('password').value;
				if (username != "" && password != "") {
					SetCookie(username, password);
				}
			} else {
				SetCookie("", "");
			}
		} catch (e) {

		}
	}

</script>
